<template>
    <no-permission v-if="!canSee" :title="failMsg">
        <div class="desc">
            <p style="font-size: 16px">
                <strong>符合以下任意一个条件的项目才允许查看:</strong>
            </p>
            <p>
                1. 项目申请人可以查看自己申请的项目；
            </p>
            <p>
                2. 指导老师可以查看自己指导的项目；
            </p>
            <p>
                3. 院级管理员可以查看负责学院为本学院的项目；
            </p>
            <p>
                4. 教务处管理员可以查看全校所有项目。
            </p>
        </div>  
    </no-permission>
    <a-tabs v-else v-model:activeKey="activeKey" class="tab-page-container">
        <template #leftExtra>
            <div class="page-title-area">
                查看大创项目
            </div>
        </template>
        <a-tab-pane key="basic-info" tab="基本信息" class="page-pane nopadding" >
            <PageSkeleton v-if="isLoading"></PageSkeleton>
            <BasicInfo v-else />
        </a-tab-pane>
        <a-tab-pane key="doc" tab="申报书" class="page-pane nopadding" >
            <ProjDetail :data />
        </a-tab-pane>
        <a-tab-pane key="full-process" tab="全过程" class="page-pane" >
            {{ id }}
        </a-tab-pane>
        <a-tab-pane key="app-process" tab="申请流程记录" class="page-pane" >
            {{ id }}
        </a-tab-pane>
    </a-tabs>
</template>

<script setup>
import app from '@/app'
import axios from '@/axios'
import { ref, onMounted, provide, reactive } from 'vue';
import { useRoute } from 'vue-router';
import BasicInfo from './basic-info.vue'
import ProjDetail from '../detail-views/proj-detail.vue'
import cache from '../ProjectCache'
import PageSkeleton from "@proj/components/page-skeleton.vue";

app.setTitle("查看大创项目");
const route = useRoute();
const id = route.query.id;
const activeKey = ref("basic-info");
const canSee = ref(true);
const canEdit = ref(false);
const failMsg = ref("你无权查看此项目");
let isLoading = ref(true);
const data = reactive({
    basicInfo: {
        ID: app.GUID_EMPTY,
        ProjectName: "",
        ProjectType: "创新训练"
    },
    extInfo: {},
    members: [],
    otherTeachers: [],
});
async function load () {
    isLoading.value = true;
    let proj = await cache.getProj(id);
    canSee.value = proj.canSee;
    failMsg.value = proj.failMsg;
    canEdit.value = proj.canEdit;
    if (canSee.value) {
        Object.assign(data, proj);
        app.setTitle(data.basicInfo.ProjectName || "查看大创项目");
    }
    isLoading.value = false;
}

provide("data", data);
onMounted(load);
</script>

<style lang="less">

</style>